Observer Pattern

TL;DR

Observers subscribe to changes from a subject and react when it emits updates.

Why it matters

• Decouples event producers from consumers.
• Powers UI state updates, event buses, and reactive streams.

How it works

Example (TypeScript)

type Listener<T> = (value: T) => void;

class Observable<T> {
  private listeners = new Set<Listener<T>>();
  subscribe(listener: Listener<T>) {
    this.listeners.add(listener);
    return () => this.listeners.delete(listener);
  }
  next(value: T) {
    this.listeners.forEach((listener) => listener(value));
  }
}

const prices = new Observable<number>();
const unsubscribe = prices.subscribe((value) => console.log('price', value));
prices.next(42);
unsubscribe();

Quick recall Q&A